/* pages/signin/index.wxss */
page {
	background-color: #FBFBFB;
}

// 顶部背景
.top-bg {
	background: linear-gradient(to right, #FF8143FF 390rpx, #FF5B31FF 1140rpx);
	width: 1532rpx;
	height: 400rpx;
	position: absolute;
	top: -114rpx;
	left: 50%;
	transform: translateX(-50%);
	border-radius: 50%;
	z-index: -1;
}

.userinfo-box {
	display: flex;
	padding: 48rpx 32rpx 0;

	.content-box {
		color: white;
		font-size: 24rpx;
		margin-left: 24rpx;

		.name {
			font-size: 28rpx;
			font-weight: bold;
			margin-bottom: 12rpx;
		}
	}
}

.signin-container {
	border-radius: 20rpx;
	margin: 72rpx 32rpx 0;
	background-color: #fff;
	padding: 32rpx;

	.week-box {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		grid-gap: 20rpx;

		.week-day {
			width: 140rpx;
			height: 140rpx;
			border-radius: 20rpx;
			position: relative;
			background: linear-gradient(146deg, #E55253 0%, #DB2A2B 100%);

			.day-text {
				position: absolute;
				top: 0;
				left: 0;
				font-size: 20rpx;
				width: 86rpx;
				height: 44rpx;
				line-height: 44rpx;
				padding-left: 12rpx;
				border-radius: 44rpx 0rpx 100rpx 0rpx;
				background-color: #F9C254;
				color: #B60102;
			}

			.status {
				padding-top: 56rpx;
				text-align: center;
				font-size: 40rpx;
				color: #F9C254;

				.signin-icon {
					width: 76rpx;
					height: 64rpx;
				}

				.error-icon {
					position: absolute;
					top: 0;
					left: 54rpx;
					width: 40rpx;
					height: 101rpx;
				}
			}

			&.expire {
				background: rgba(48, 48, 48, 0.10);

				.day-text {
					color: white;
					background-color: rgba(48, 48, 48, 0.3);
				}

				.status {
					color: #B2B2B2;
				}
			}
		}
	}

	.info-box {
		display: flex;
		align-items: center;
		margin-top: 60rpx;

		.calendar {
			width: 96rpx;
			height: 84rpx;
		}

		.content {
			flex: 1;
			text-align: center;
			font-size: 28rpx;
			font-weight: bold;
			color: #303030;
		}
	}

	.signin-btn {
		margin-top: 32rpx;
		text-align: center;
		.van-button {
			width: 296rpx;
			height: 80rpx;
		}
	}
}